import Vue from 'vue'

import 'normalize.css/normalize.css' // A modern alternative to CSS resets

import DictTag from '@/components/DictTag'
import Pagination from '@/components/Pagination'
import RightToolbar from '@/components/RightToolbar'
import '@/icons' // icon
import '@/permission' // permission control
import '@/styles/index.scss' // global css
import { getToken } from '@/utils/auth'
import Axios from 'axios'
import iconPicker from 'e-icon-picker'
import 'e-icon-picker/lib/index.css' // 基本样式，包含基本图标
import 'e-icon-picker/lib/symbol.js' // 基本彩色图标库
import ElementUI from 'element-ui'
import locale from 'element-ui/lib/locale/lang/zh-CN' // lang i18n
import 'element-ui/lib/theme-chalk/icon.css' // element-ui 图标库
import 'element-ui/lib/theme-chalk/index.css'
import 'font-awesome/css/font-awesome.min.css' // font-awesome 图标库
import qs from 'qs'
import App from './App'
import router from './router'
import store from './store'

import axios from 'axios'
import { Message, MessageBox } from 'element-ui'
/**
 * 解决el-dialog弹出时，页面抖动，右侧会缩小的问题
 */
import Element from 'element-ui'
Element.Dialog.props.lockScroll.default = false
Vue.use(Element)

Vue.prototype.axios = Axios
Axios.defaults.baseURL = 'http://localhost:8080'
Vue.component('Pagination', Pagination)
Vue.component('DictTag', DictTag)
Vue.component('RightToolbar', RightToolbar)
Vue.prototype.qs = qs
// 配置axios拦截请求，添加token头信息
axios.interceptors.request.use(
  config => {
    const token = getToken()
    if (token) {
      // 把localStorage的token放在Authorization里
      config.headers.Authorization = token
    }
    return config
  },
  function(err) {
    console.log('失败信息' + err)
  }
)

// 错误响应拦截
axios.interceptors.response.use(
  res => {
    if (res.data.status === 'OK') {
      return res
    }
    if (res.data.status === 'AUTH_ERROR') {
      MessageBox.confirm('登录状态失效，请重新登录', '系统提示', {
        confirmButtonText: '重新登录',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        store.dispatch('user/resetToken').then(() => {
          location.reload()
        })
      })
    } else {
      Message.error(res.data.data || res.data.message || '系统错误、请联系管理员')
    }
  },
  error => {
    console.log('失败信息' + error);
    let errorMsg = '';
    if (error.response && error.response.data && error.response.data.message){
      errorMsg = error.response.data.message;
    } else {
      errorMsg = error.message || '系统错误、请联系管理员';
    }
    Message.error(errorMsg)
    return Promise.reject(error);
  }
);
// axios.interceptors.response.use(res => {
//   console.log('拦截响应');
//   console.log(res);
//   if (res.data.status === 'OK') {
//     return res
//   }
//   if (res.data.status === 'AUTH_ERROR') {
//     MessageBox.confirm('登录状态失效，请重新登录', '系统提示', {
//       confirmButtonText: '重新登录',
//       cancelButtonText: '取消',
//       type: 'warning'
//     }).then(() => {
//       store.dispatch('user/resetToken').then(() => {
//         location.reload()
//       })
//     })
//   } else {
//     Message.error(res.data.data)
//   }
// })
/**
 * If you don't want to use mock-server
 * you want to use MockJs for mock api
 * you can execute: mockXHR()
 *
 * Currently MockJs will be used in the production environment,
 * please remove it before going online ! ! !
 */
// if (process.env.NODE_ENV === 'production') {
//   const { mockXHR } = require('../mock')
//   mockXHR()
// }

// set ElementUI lang to EN
Vue.use(ElementUI, { locale })

// 全局删除增加图标
Vue.use(iconPicker, {
  FontAwesome: true,
  ElementUI: true,
  eIcon: true,
  eIconSymbol: true,
  addIconList: [],
  removeIconList: [],
  zIndex: 9999
})

// 如果想要中文版 element-ui，按如下方式声明
// Vue.use(ElementUI)

Vue.config.productionTip = false

new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})
